<template>
  <a-date-picker
    showTime
    @change="onChange"
    :allowClear="false"
    class="w200"
    v-model="value"
    format="YYYY年MM月DD日 HH:mm:ss">
  </a-date-picker>
</template>

<script>
import moment from 'moment'
const defaultVal = '2000-01-01 00:00:00'
const fmt = 'YYYY-MM-DD HH:mm:ss'
export default {
  model: {
    prop: 'modelVal', // 指向props的参数名
    event: 'change'// 事件名称
  },
  props: {
    modelVal: {
      type: String,
      default: defaultVal
    }
  },
  data () {
    return {
      value: null
    }
  },
  mounted () {
    this.setValue()
  },
  watch: {
    modelVal () {
      this.setValue()
    },
    value (newVal) {
      this.$emit('change', newVal === null ? defaultVal : newVal.format(fmt))
    }
  },
  methods: {
    setValue () {
      if (!this.modelVal || this.modelVal.length === 0) {
        // this.value = moment(defaultVal, fmt)
      } else {
        this.value = moment(this.modelVal, fmt)
      }
    },
    onChange (t) {
      if (t === null) {
        this.value = moment(defaultVal, fmt)
      }
    }
  }
}
</script>
<style lang="less" scoped>
</style>
